<template>
	<div>
		<div id="koo" style="width: 100%;height: 50px;"></div>
		<div id="da" style="width: 100%; height: 800px;">
			<div id="top" style="width:100%; height: 350px;">
				<div id="xx" style="width: 150px;height: 20px;margin-left: calc(50% - 500px)">服务人员信息</div>
				<div id="b" style="width: 1000px; margin-top: 20px; margin-left: calc(50% - 500px); text-align: center;">
					<el-table :data="waiter" style="1000px" height="350"> 
						<el-table-column prop='wid' label="服务人员编号"></el-table-column>
						<el-table-column prop='wname' label="服务人员姓名"></el-table-column>
						<el-table-column label="操作">
							<template slot-scope="owner">
								<el-button @click='delw(owner.row.wid)'>解雇</el-button>
							</template>
						</el-table-column>
					</el-table>
				</div>
			</div>
			<div id="bottom" style="width:100%; height: 350px; margin-top:50px;">
				<div id="xx" style="width: 150px;height: 20px;margin-left: calc(50% - 500px)">后厨人员信息</div>
				<div id="b" style="width: 1000px; margin-top: 20px; margin-left: calc(50% - 500px); text-align: center;">
					<el-table :data="cooker" style="1000px" height="350">
						<el-table-column prop='cid' label="后厨人员编号"></el-table-column>
						<el-table-column prop='cname' label="后厨人员姓名"></el-table-column>
						<el-table-column label="操作">
							<template slot-scope="owner">
								<el-button @click='delc(owner.row.cid)'>解雇</el-button>
							</template>
						</el-table-column>
					</el-table>
				</div>
			</div>
		</div>
	</div>
</template>

<script>
	export default{
		data:function(){
			return {
				waiter:[],
				cooker:[],
			}
		},
		created: function() {
			this.query();
		},
		methods:{
			query:function(){
				this.$http.get('http://localhost:8080/OrderSystemServer/order/user/waitershow')
					.then((response) => {
						console.log(response);
						
						this.waiter = response.data.body;
					});
				this.$http.get('http://localhost:8080/OrderSystemServer/order/user/cookershow')
					.then((response) => {
						console.log(response);
						this.cooker = response.data.body;
					});
			},
			delw:function(wid){
				this.$http.get(`http://localhost:8080/OrderSystemServer/order/user/waiterdel?wid=${wid}`)
				.then((response)=>{
					if(response.data.isOK)
					{
						this.$message({
									type: 'success',
									message: '删除成功'
								});
					}
					this.query();
				});
			},
			delc:function(cid){
				this.$http.get(`http://localhost:8080/OrderSystemServer/order/user/cookerdel?cid=${cid}`)
				.then((response)=>{
					if(response.data.isOK)
					{
						this.$message({
									type: 'success',
									message: '删除成功'
								});
					}
					this.query();
				});
			}
		}
	}
</script>

<style>

</style>